<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
    <div class="table-responsive">
        <table class="table table-bordered">
            <thead>
            <tr>
                <th class="text-center">
                    <div>ID</div>
                </th>
                <th class="text-center" width="30%">名称</th>
                <th class="text-center" width="20%">时长</th>
                <th class="text-center" width="10%">类型</th>
                <th class="text-center" width="30%">视频商</th>
                <th class="text-center" width="6%">操作</th>
            </tr>
            </thead>
        </table>
        <div class="J_V_tabContent table-xScrollWrap">
            <table class="table table-bordered table-hover table-xs-content">
                <tbody id="tbody">
                <tr class="jqgfirstrow" role="row">
                    <th class="text-center">
                        <div>&nbsp;</div>
                    </th>
                    <th class="text-center" width="33%">&nbsp;</th>
                    <th class="text-center" width="20%"></th>
                    <th class="text-center" width="10%">&nbsp;</th>
                    <th class="text-center" width="30%">&nbsp;</th>
                    <th class="text-center" width="6%">&nbsp;</th>
                </tr>
                <tr th:if="${#lists.isEmpty(dataMap['list'])}">
                    <td colspan="8" class="text-center">
                        <div class="noDataTipsBox">
                            <p><span class="c-4e fs16">亲，还没有素材数据~~~</span></p>
                        </div>
                    </td>
                </tr>
                <tr th:if="!${#lists.isEmpty(dataMap['list'])}" th:each="material : ${dataMap['list']}" th:attr="data-id=${material['id']},id='material-'+${material['id']}">
                    <td class="text-center">
                        <input th:type="${#strings.isEmpty(selectType)}?'checkbox':${selectType}" class="i-checks" th:attrappend="data-live-begin=${material['liveBeginTime']},data-live-end=${material['liveEndTime']},data-typekey=${material['typeKey']},data-video-duration=${material['videoDuration']}" name="materialId" th:title="${material['name']}" th:value="${material['id']}">
                        <div th:attrappend="id='article-summary-'+${material['id']}" class="hide" th:text="${material['articleSummary']}"></div>
                        <div th:attrappend="id='article-context-'+${material['id']}" class="hide" th:text="${material['articleContext']}"></div>
                    </td>
                    <td class="text-center materialName" th:text="${material['name']}"></td>
                    <td class="text-center videoDuration" th:text="${material['videoDuration']}"></td>
                    <td class="text-center">
                        <th:block th:each="materialType : ${materialTypeList}">
                            <span th:if="${material['typeKey']}==${materialType.key}" th:text="${materialType.value}"></span>
                        </th:block>
                    </td>
                    <td class="text-center">
                        <span th:if="!${#strings.isEmpty(material['playType'])}">268云服务</span>
                        <span th:if="${#strings.isEmpty(material['playType'])}">—</span>
                    </td>
                    <td class="text-center">
                        <a th:if="${material['typeKey']}!='LIVE'" href="javascript:void(0);" class="c-master fs14 ml5" data-toggle="tooltip" data-placement="bottom" th:attrappend="data-original-title='预览'" >
                            <i th:attrappend="data-typeKey=${material['typeKey']},data-playUrl=${material['playUrl']}" class="fa fa-eye"></i>
                        </a>
                        <span th:if="${material['typeKey']}=='LIVE'">-</span>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <!-- 分页，开始 -->
        <div data-th-replace="layout/adminPage"></div>
        <!-- 分页，结束 -->
    </div>
</html>